<template>
  <div>
    <div class="row_list_item  flex-row">
      <div class="flex-grow-0 img_box">
        <img style="height: 100%" v-lazy="item.pic2" alt="">
      </div>
      <div class="flex-grow-1 right flex-col">
        <div class="flex-row ">
          <p class="twoLine goods_name">
            {{item.title}}
          </p>
        </div>
        <div class="flex-row count">
          <div class="huise flex-grow-1 flex-left">
            购买人数：{{item.sales}}
          </div>
          <div class="couponPrice flex-grow-1 flex-row flex-y-center flex-right">
            <div class="coupon_bg flex-grow-0"></div>
            <div class="text flex-grow-0">￥ {{item.couponMoney}}元优惠券</div>
            <div class="coupon_bg flex-grow-0 coupon_bg2 "></div>
          </div>
        </div>
        <div class="flex-row">
          <div class="huise flex-grow-1 ">
            原价:￥<span class="font-size-30">{{item.storePrice}}</span>
          </div>
          <div class="red flex-grow-1 " style="text-align: right">
            券后价:￥<span class="font-size-30">{{item.price}}</span>
          </div>
        </div>
        <div class="flex-row shopIcon">
          <img v-if="item.goodsSrc=='taobao'" v-src="'/wxStatic/img/web/taobao@2x.png'" alt="">
          <img v-if="item.goodsSrc=='tmall'" v-src="'/wxStatic/img/web/tmall-big.png'">
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: "RowList",
    props:{
      item:{
        type:Object,
        default:{}
      }
    }
  }
</script>

<style lang="less" scoped>
  .huise {
    color: #878787
  }

  .red {
    color: #FF0039
  }
  .font-size-30{
    font-size:0.3rem;
  }

  .row_list_item {
    padding: 0.2rem 0.2rem;
    position: relative;
    font-size:0.24rem;
    &:after{
      content: " ";
      position: absolute;
      left: 0;
      bottom: 0;
      right: 0;
      height: 1px;
      border-bottom: 1px solid #eeeeee;
      color: #eeeeee;
      transform-origin: 0 100%;
      transform: scaleY(0.5);
    }
    .img_box {
      width: 2.43rem;
      height: 2.43rem;
    }
    .right{
      padding-left:0.25rem;
    }
    .goods_name {
      font-size: 0.28rem;
      line-height: 0.34rem;
    }
    .count{
      margin-top: 0.3rem;
      margin-bottom: 0.1rem;
    }
    .shopIcon{
      display: inline-block;
      width: 0.6rem;
      margin-top:0.1rem;
    }
    .couponPrice {
      height: 0.37rem;
      font-size: 0.2rem;
      color: #fff;
      text-align: right;
      .coupon_bg {
        height: 0.37rem;
        width: 0.31rem;
        background: url(../../wxStatic/img/web/coupon.png) no-repeat center center;
        background-size: 100% 100%;
      }
      .text {
        height: 0.37rem;
        background: #ff3674;
        line-height: 0.37rem;
      }
      .coupon_bg2 {
        background: url(../../wxStatic/img/web/coupon2.png) no-repeat center center;
        background-size: 100% 100%;
      }
    }
  }
</style>